<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title></title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="robots" content="all,follow">
    <!-- Bootstrap CSS-->
    <link rel="stylesheet" href="/vendor/bootstrap/css/bootstrap.min.css">
    <!-- Font Awesome CSS-->
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css"
          integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">
    <!-- Google fonts - Popppins for copy-->
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins:300,400,800">
    <!-- orion icons-->
    <link rel="stylesheet" href="/css/orionicons.css">
    <!-- theme stylesheet-->
    <link rel="stylesheet" href="/css/style.default.css" id="theme-stylesheet">
    <!-- Custom stylesheet - for your changes-->
    <link rel="stylesheet" href="/css/custom.css">
    <!-- Favicon-->
    <link rel="shortcut icon" href="/img/favicon.png?3">
    <!-- Tweaks for older IEs--><!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]-->

</head>
<body>
<div th:replace="publicheader::header"></div>
<div class="d-flex align-items-stretch">
    <div id="sidebar" class="sidebar py-3">
        <div class="text-gray-400 text-uppercase px-3 px-lg-4 py-4 font-weight-bold small headings-font-family">MAIN</div>
        <div th:replace="publicsidebar::sidebar"></div>
    </div>
    <div class="page-holder w-100 d-flex flex-wrap">
        <div class="container-fluid px-xl-5" style="padding-top: 20px">

            <!--            周报管理-->
            <h1>学生填写周报，周报含标题时间内容等信息
                只包含新增、删除、查询功能</h1>
<!--            <p th:text="${weekly}"></p>-->
            <!-- Large modal -->

            <button type="button" class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-lg">点我写周报</button>

            <div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" style="padding: 20px">
                <div class="modal-dialog modal-lg" role="document">
                    <div class="modal-content">
                        <div style="padding: 20px">
                        <form action="/weekly/insertweek" method="post">
                            <div id="editor" name="editor" style="padding: 20px">
                                <p>在此输入 <b>周报</b> </p>
                            </div>
                                <input id ="content" name="content" hidden="hidden">
                                <input hidden="hidden" >
                            <button type="submit" class="btn btn-warning" id="submit" align="right">提交周报</button>
                        </form>
                        </div>
                    </div>
                </div>
            </div>


            <div class="showing">
                <table class="table table-striped card-text" style="padding-left: 5px;padding-right: 5px;border-radius: 5px">
                    <thead>
                    <tr>
                        <th>周报正文</th>
                        <th>提交时间</th>
                        <th>评分</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr th:each="w: ${weekly}">
                        <td th:text="${w.weekContent}" class="weekcontent"></td>
                        <td th:text="${w.weekTime}"></td>
                        <td th:text="${w.flag}?${w.flag}:老师暂未评分"></td>
                        <td> <button style="border-radius: 20px"><a th:href="@{/weekly/deleteweek(weekId=${w.weekId})}">删除</a></button></td>
                    </tr>
                    </tbody>
                </table>
            </div>

        </div>
        <div th:replace="publicfooter::footer"></div>
    </div>
</div>
<!-- JavaScript files-->
<script src="/vendor/jquery/jquery.min.js"></script>
<script src="/vendor/popper.js/umd/popper.min.js"></script>
<script src="/vendor/bootstrap/js/bootstrap.min.js"></script>
<script src="/vendor/jquery.cookie/jquery.cookie.js"></script>
<script src="/vendor/chart.js/Chart.min.js"></script>
<script src="/js/js.cookie.min.js"></script>
<script src="/js/front.js"></script>
<script type="text/javascript" src="/js/wangEditor.js"></script>


<script type="text/javascript">
    $(function () {
        var weekcontent=$(".weekcontent");
        $.each(weekcontent,function(ind,item){
            if(item.innerText.length>50){//循环判断td中含有的字数
                item.innerText=item.innerText.substring(0,30)+"...";//如果字数超过，则截取内容，拼接上“...”显示
            }
        });
    });

    var E = window.wangEditor
    var editor = new E('#editor')
    // 或者 var editor = new E( document.getElementById('editor') )
    editor.create()

    document.getElementById('submit').addEventListener('click', function () {
        // 读取 text
        $("#content").val(editor.txt.text());
    })


</script>

</body>
</html>